<template>
  <div class="alipay-config-page">
    <page-header-wrapper>
      <page-tab-list>
        <a-alert message="此配置用于支付宝支付" type="info" show-icon style="margin:24px 0;" />
        <template>
          <a-row :gutter="[16, 30]" type="flex" align="top">
            <a-col class="required" :span="4" style="text-align: right"> 支付宝AppId： </a-col>
            <a-input class="input-class" v-model="params.app_id" :disabled="is_saas == 1"/>
          </a-row>
          <a-row :gutter="[16, 30]" type="flex" align="top">
            <a-col class="required" :span="4" style="text-align: right"> User ID： </a-col>
            <a-input class="input-class" v-model="params.user_id" :disabled="is_saas == 1" />
          </a-row>
          <a-row :gutter="[16, 30]" type="flex" align="top">
            <a-col class="required" :span="4" style="text-align: right"> 支付宝商户名称（用于分账）：： </a-col>
            <a-input class="input-class" v-model="params.name" :disabled="is_saas == 1" />
          </a-row>
          <a-row :gutter="[16, 30]" type="flex" align="top" v-if="is_saas != 1">
            <a-col class="required" :span="4" style="text-align: right"> Aes Key： </a-col>
            <a-input class="input-class" v-model="params.aes_key" />
          </a-row>
          <a-row :gutter="[16, 30]" type="flex" align="top" v-if="is_saas != 1">
            <a-col class="required" :span="4" style="text-align: right"> 支付宝公钥(alipay_public_key)： </a-col>
            <a-textarea class="input-class" v-model="params.alipay_public_key" auto-size />
            <!-- <a-textarea style="width:500px;height: 100px;margin: 15px 0 40px 0;" v-model="params.alipay_public_key"/> -->
          </a-row>
          <a-row :gutter="[16, 30]" type="flex" align="top" v-if="is_saas != 1">
            <a-col class="required" :span="4" style="text-align: right"> 应用公钥： </a-col>
            <a-textarea class="input-class" v-model="params.app_public_key" auto-size />
            <!-- <a-textarea style="width:500px;height: 100px;margin: 15px 0 40px 0;" v-model="params.app_public_key"/> -->
          </a-row>
          <a-row :gutter="[16, 30]" type="flex" align="top" v-if="is_saas != 1">
            <a-col class="required" :span="4" style="text-align: right"> 应用私钥： </a-col>
            <a-textarea class="input-class" v-model="params.app_private_key" auto-size />
            <!-- <a-textarea style="width:500px;height: 100px;margin-bottom: 30px;" v-model="params.app_private_key"/> -->
          </a-row>
          <a-row :gutter="[30, 30]" type="flex" align="middle">
            <a-col offset="10">
              <a-button type="primary" @click="onSave"> 保存 </a-button>
            </a-col>
          </a-row>
        </template>
      </page-tab-list>
    </page-header-wrapper>
  </div>
</template>
<script>
import { getAlipayConfig, setAlipayConfig } from '@/api/setting/alipayConfig'

export default {
  name: 'AlipayConfig',
  components: {},
  data() {
    return {
      params: {
        app_id: null,
        alipay_public_key: null,
        app_public_key: null,
        app_private_key: null,
        aes_key: null,
        user_id: null,
        name: null,
      },
      is_saas:0
    }
  },
  created() {
    this.getData()
  },
  methods: {
    onSave() {
      const hide = this.$message.loading('提交中', 0)
      setAlipayConfig(this.params).then((res) => {
        hide()
        if (res.code !== 0) {
          this.$error({
            content: res.msg,
          })
        } else {
          this.$message.success('保存成功！')
        }
      })
    },
    getData: function () {
      getAlipayConfig({}).then((res) => {
        const data = res.data
        if (data) {
          this.params.alipay_public_key = data.alipay_public_key
          this.params.app_id = data.app_id
          this.params.app_private_key = data.app_private_key
          this.params.app_public_key = data.app_public_key
          this.params.aes_key = data.aes_key
          this.params.user_id = data.user_id
          this.params.name = data.name
          this.is_saas = data.is_saas
        }
      })
    },
  },
}
</script>
<style lang="less" scoped>
.alipay-config-page {
  .required::before {
    content: '*';
    color: red;
  }
  .input-class {
    width: 1100px;
    margin: 10px 8px 25px 0;
  }
  input {
    max-width: 600px;
  }
  textarea {
    max-width: 600px;
  }
}
</style>
